.colorYellow {
  color: #AF711C;
}
.is-none {
  display: none !important;
}
.w200 {
  width: 200px;
}
.f1 {
  flex: 1;
}
.w250 {
  width: 250px;
}
.w370 {
  width: 370px;
}
.w285 {
  width: 285px;
}
div.other-style {
  background: #ffffff;
  box-shadow: 0px 12px 10px 0px rgba(0, 0, 0, 0.05);
}
div.other-style .header-inner--nav .header-inner--item a {
  color: #333333;
}
div.other-style .header-inner--admin--unlogin span {
  color: #333333;
}
div.other-style .header-inner--admin--unlogin span#login::after {
  background-color: #333;
}
.page-header {
  height: 80px;
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  z-index: 2;
  font-size: 16px;
  font-family: PingFangSC-Regular, PingFang SC;
  transition: all 0.3s;
}
.page-header .header-inner {
  width: 1200px;
  height: calc(100% - 3px);
  margin: auto;
  display: flex;
  justify-content: space-between;
}
.page-header .header-inner--logo {
  flex: 1;
  display: flex;
  align-items: center;
}
.page-header .header-inner--nav {
  flex: 3;
  display: flex;
}
.page-header .header-inner--nav .header-inner--item {
  height: 100%;
  cursor: pointer;
  margin: 0 18px;
  transition: all 0.3s ease;
}
.page-header .header-inner--nav .header-inner--item a {
  height: 100%;
  display: flex;
  align-items: center;
  color: #FFFFFF;
}
.page-header .header-inner--nav .header-inner--item a img {
  margin-right: 4px;
}
.page-header .header-inner--nav .header-inner--item:hover {
  border-bottom: 3px solid #3bb79c;
}
.page-header .header-inner--nav .header-inner--item:hover a {
  color: #3BB79C;
}
.page-header .header-inner--nav .header-inner--item.nav-active {
  border-bottom: 3px solid #3bb79c;
}
.page-header .header-inner--nav .header-inner--item.nav-active a {
  color: #3BB79C;
}
.page-header .header-inner--admin {
  flex: 1;
  display: flex;
  align-items: center;
  justify-content: flex-end;
}
.page-header .header-inner--admin--unlogin {
  display: flex;
}
.page-header .header-inner--admin--unlogin img {
  width: 20px;
  margin-right: 10px;
}
.page-header .header-inner--admin--unlogin span {
  font-size: 16px;
  color: #FFFFFF;
  text-shadow: 0px 12px 10px rgba(0, 0, 0, 0.05);
  position: relative;
  cursor: pointer;
}
.page-header .header-inner--admin--unlogin span:hover {
  color: #3BB79C;
}
.page-header .header-inner--admin--unlogin span#login {
  padding-right: 8px;
}
.page-header .header-inner--admin--unlogin span#login::after {
  content: "";
  position: absolute;
  top: 4px;
  right: 0;
  width: 1px;
  height: 14px;
  background-color: #FFFFFF;
}
.page-header .header-inner--admin--unlogin span#register {
  padding-left: 8px;
}
.page-header .header-inner--admin--unvip {
  height: 100%;
  display: flex;
  align-items: center;
  position: relative;
  cursor: pointer;
}
.page-header .header-inner--admin--unvip .header-inner--admin--pop {
  display: none;
  position: absolute;
  top: 100%;
  left: 0;
  width: 150px;
  height: 415px;
  background: #ffffff;
  box-shadow: 0px 2px 10px 0px rgba(0, 0, 0, 0.05);
  border-radius: 4px;
  border: 1px solid #f3f3f3;
  box-sizing: border-box;
  overflow: hidden;
}
.page-header .header-inner--admin--unvip .header-inner--admin--pop .admin--pop--head {
  height: 70px;
  display: flex;
  flex-direction: column;
  justify-content: center;
  padding-left: 20px;
}
.page-header .header-inner--admin--unvip .header-inner--admin--pop .admin--pop--head.admin-current {
  background: #e8ebee;
}
.page-header .header-inner--admin--unvip .header-inner--admin--pop .admin--pop--head.admin-current h3 {
  font-size: 16px;
  font-weight: 600;
  color: #333333;
  line-height: 22px;
}
.page-header .header-inner--admin--unvip .header-inner--admin--pop .admin--pop--head.admin-current p {
  font-size: 12px;
  font-weight: 400;
  color: #333333;
  line-height: 17px;
}
.page-header .header-inner--admin--unvip .header-inner--admin--pop .admin--pop--head.admin-current .admin-vip {
  display: none;
}
.page-header .header-inner--admin--unvip .header-inner--admin--pop .admin--pop--head.admin-active {
  background: linear-gradient(90deg, #2b2d36 0%, #3a404f 54%, #232631 100%);
}
.page-header .header-inner--admin--unvip .header-inner--admin--pop .admin--pop--head.admin-active h3 {
  font-size: 16px;
  font-weight: 600;
  color: #f4ccb7;
  line-height: 22px;
}
.page-header .header-inner--admin--unvip .header-inner--admin--pop .admin--pop--head.admin-active p {
  font-size: 12px;
  font-weight: 400;
  color: #f4ccb7;
  line-height: 17px;
}
.page-header .header-inner--admin--unvip .header-inner--admin--pop .admin--pop--head.admin-active .update-vip {
  /* display: none; */
}
.page-header .header-inner--admin--unvip .header-inner--admin--pop ul {
  padding: 8px 0;
}
.page-header .header-inner--admin--unvip .header-inner--admin--pop ul li {
  display: flex;
  align-items: center;
  padding: 0 20px;
  font-weight: 400;
  color: #333333;
  line-height: 36px;
  font-size: 14px;
  box-sizing: border-box;
}
.page-header .header-inner--admin--unvip .header-inner--admin--pop ul li:hover {
  background: #f8f9fc;
  color: #3BB79C;
}
.page-footer {
  width: 100%;
}
.page-footer .page-footer-detail {
  height: 300px;
  background-color: #2E323A;
}
.page-footer .page-footer-detail .detail-inner {
  width: 1200px;
  display: flex;
  margin: 0 auto;
  padding-top: 60px;
  box-sizing: border-box;
}
.page-footer .page-footer-detail .detail-inner-left {
  width: 810px;
  display: flex;
  padding-right: 70px;
  box-sizing: border-box;
  border-right: 1px solid #3B424A;
}
.page-footer .page-footer-detail .detail-inner-left--col {
  display: flex;
  flex-direction: column;
  flex: 1;
}
.page-footer .page-footer-detail .detail-inner-left--col h3 {
  font-size: 18px;
  font-weight: 500;
  color: #dddddd;
  padding-bottom: 16px;
}
.page-footer .page-footer-detail .detail-inner-left--col a {
  color: #6f757c;
  line-height: 32px;
}
.page-footer .page-footer-detail .detail-inner-left--col a:hover {
  color: #3BB79C;
}
.page-footer .page-footer-detail .detail-inner-left--col h2 {
  font-size: 24px;
  font-family: Arial-BoldMT, Arial;
  font-weight: normal;
  color: #dddddd;
  line-height: 32px;
}
.page-footer .page-footer-detail .detail-inner-left--col div {
  font-size: 14px;
  color: #6f757c;
  line-height: 16px;
  margin-bottom: 30px;
}
.page-footer .page-footer-detail .detail-inner-left--col p {
  font-size: 14px;
  font-weight: 500;
  color: #dddddd;
}
.page-footer .page-footer-detail .detail-inner-right {
  width: 390px;
  padding-left: 66px;
  box-sizing: border-box;
}
.page-footer .page-footer-detail .detail-inner-right--logo {
  text-align: right;
}
.page-footer .page-footer-detail .detail-inner-right--qrcodes {
  display: flex;
  align-items: center;
  padding-top: 18px;
}
.page-footer .page-footer-detail .detail-inner-right--qrcodes div {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  margin-right: 40px;
}
.page-footer .page-footer-detail .detail-inner-right--qrcodes div p {
  font-size: 12px;
  font-weight: 500;
  color: #707479;
  line-height: 32px;
}
.page-footer .page-footer-copy {
  height: 80px;
  background: #202327;
  padding-top: 12px;
  box-sizing: border-box;
}
.page-footer .page-footer-copy .copy--links {
  display: flex;
  align-items: center;
  justify-content: center;
  height: 32px;
  font-size: 12px;
  color: #6f757c;
}
.page-footer .page-footer-copy .copy--links a {
  color: #6f757c;
  padding: 0 6px;
}
.page-footer .page-footer-copy .copy--links a:hover {
  color: #3BB79C;
}
.page-footer .page-footer-copy .copy--right {
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 12px;
  color: #6f757c;
}
.page-container {
  width: 100%;
  min-height: calc(100vh - 380px);
  box-sizing: border-box;
}
.page-container .page-banner {
  height: 400px;
  background-image: url(../images/banner.png);
  background-size: cover;
  background-repeat: no-repeat;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
}
.page-container .page-banner h1 {
  font-size: 52px;
  font-weight: 500;
  color: #ffffff;
  line-height: 73px;
  letter-spacing: 2px;
  margin-top: 40px;
}
.page-container .page-banner--line {
  width: 50px;
  height: 6px;
  background: #2dd3be;
  border-radius: 6px;
  margin-bottom: 20px;
}
.page-container .page-banner p {
  font-size: 16px;
  color: #ffffff;
  line-height: 26px;
  letter-spacing: 1px;
}
.page-container .page-banner-btns {
  margin-top: 30px;
  display: flex;
}
.page-container .page-banner-btns .first-party {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  width: 575px;
  height: 135px;
  background: linear-gradient(230deg, #23f0b6 0%, #02a4a1 100%);
  border-radius: 14px;
  margin-right: 50px;
  cursor: pointer;
}
.page-container .page-banner-btns .second-party {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  width: 575px;
  height: 135px;
  background: linear-gradient(53deg, #865df4 0%, #aa70eb 100%);
  border-radius: 14px;
  cursor: pointer;
}
.page-container .page-banner-btns h2 {
  font-size: 36px;
  font-weight: 500;
  color: #ffffff;
  line-height: 50px;
  letter-spacing: 1px;
}
.page-container .page-banner-btns span {
  font-size: 14px;
  color: #ffffff;
  line-height: 20px;
  letter-spacing: 1px;
}
